@import './variables.scss';


// 生成基础margin padding

//	四周  上      右     下      左     上下     左右
// .m    .mt    .mr    .mb    .ml    .mtb    .mlr
// .m-sm .mt-sm .mr-sm .mb-sm .ml-sm .mtb-sm .mlr-sm
// .m-lg .mt-lg .mr-lg .mb-lg .ml-lg .mtb-lg .mlr-lg

// .p    .pt    .pr    .pb    .pl    .ptb    .plr
// .p-sm .pt-sm .pr-sm .pb-sm .pl-sm .ptb-sm .plr-sm
// .p-lg .pt-lg .pr-lg .pb-lg .pl-lg .ptb-lg .plr-lg


@each $type1, $type2  in (m: margin, p: padding) {
    @each $key, $value in ("", $base) (-sm, $sm) (-lg, $lg) {
        @each $val1, $val2 in 
        ('', $value)
        (t, $value 0 0 0)
        (r, 0 $value 0 0)
        (b, 0 0 $value 0)
        (l, 0 0 0 $value)
        (tb, $value 0 )
        (lr, 0 $value)
        {
            .#{$type1}#{$val1}#{$key} {
                #{$type2}: #{$val2};
            }
        }
    }
}

// 生成基础margin padding
 // 生成基础margin padding

 //	四周  上      右     下      左     上下     左右
 // .m    .mt    .mr    .mb    .ml    .mtb    .mlr
 // .p    .pt    .pr    .pb    .pl    .ptb    .plr

// 例子： mt20   ---->   margin-top: 20px;

@each $type1, $type2  in (m: margin, p: padding) {
    @for $size from 0 to 1000 {
        @each $val1, $val2 in 
        ('', $size + px)
        (t, $size + px 0 0 0)
        (r, 0 $size + px 0 0)
        (b, 0 0 $size + px 0)
        (l, 0 0 0 $size + px)
        (tb, $size + px 0 )
        (lr, 0 $size + px)
        {
            .#{$type1}#{$val1}#{$size} {
                #{$type2}: #{$val2};
            }
        }
    }
}